import Vue from 'vue'

// !可以做到各个浏览器的初始样式统一
import 'normalize.css/normalize.css' // A modern alternative to CSS resets

// !全局引入 ElementUI 组件和样式
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
// !引入处理国际化的语言包
// import locale from 'element-ui/lib/locale/lang/en' // lang i18n

// !自己的全局样式
import '@/styles/index.scss' // global css
// !根组件
import App from './App'
// !引入 store 仓库实例，里面配置 Vuex 相关的代码
import store from './store'
// !引入路由实例
import router from './router'

// !引入所有的图标
import '@/icons' // icon

// !引入权限（界面访问控制）相关代码
import '@/permission' // permission control

// !引入过滤器
// import '@/filters'
import * as filters from '@/filters'
// 注册所有的过滤器
for (const filterName in filters) {
  Vue.filter(filterName, filters[filterName])
}

import { transListToTreeData, checkPermission } from '@/utils'

// import '@/directives'
import * as directives from '@/directives'
for (const directiveName in directives) {
  Vue.directive(directiveName, directives[directiveName])
}

// import mixin from '@/mixins'

// import constants from './constants'

// 往 Vue 原型上面挂载的所有属性和方法，所有组件都可以通过 this 访问
Vue.prototype.transListToTreeData = transListToTreeData

Vue.prototype.checkPermission = checkPermission

// 全家混入，所有组件都具有了 mixin 对象中的所有东西
// Vue.mixin(mixin)

// Vue.prototype.constants = constants

// !项目的入口文件

/**
 * If you don't want to use mock-server
 * you want to use MockJs for mock api
 * you can execute: mockXHR()
 *
 * Currently MockJs will be used in the production environment,
 * please remove it before going online ! ! !
 */
// !注释掉，因为我们有自己的接口
/* if (process.env.NODE_ENV === 'production') {
  const { mockXHR } = require('../mock')
  mockXHR()
} */

// set ElementUI lang to EN
// Vue.use(ElementUI, { locale })
// 如果想要中文版 element-ui，按如下方式声明
Vue.use(ElementUI)

Vue.config.productionTip = false

new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App)
})

// 原始数组
/* const list = [{
  id: 'a',
  pid: '',
  name: '总裁办'
},
{
  id: 'b',
  pid: '',
  name: '行政部'
},
{
  id: 'c',
  pid: '',
  name: '财务部',
  children: [
    {
      id: 'd',
      pid: 'c',
      name: '财务核算部'
    },
    {
      id: 'e',
      pid: 'c',
      name: '税务管理部',
      children: [
        {
          id: 'f',
          pid: 'e',
          name: '税务管理 A 部'
        },
        {
          id: 'g',
          pid: 'e',
          name: '税务管理 B 部'
        }
      ]
    }
  ]
}]
 */
// 原始数组
// const list = [{
//   id: 'a',
//   pid: '',
//   name: '总裁办'
// },
// {
//   id: 'b',
//   pid: '',
//   name: '行政部'
// },
// {
//   id: 'c',
//   pid: '',
//   name: '财务部'
// },
// {
//   id: 'd',
//   pid: 'c',
//   name: '财务核算部'
// },
// {
//   id: 'e',
//   pid: 'c',
//   name: '税务管理部'
// },
// {
//   id: 'f',
//   pid: 'e',
//   name: '税务管理 A 部'
// },
// {
//   id: 'g',
//   pid: 'e',
//   name: '税务管理 B 部'
// }]

// // 确定根 ID（''），谁的 pid 等于 根 ID，我就把谁放到第一层
// function fn1(list, id = '') {
//   const arr = []
//   list.forEach(item => {
//     // 谁（每一个对象）的 pid 等于 根 ID，就把谁放到数组里面
//     if (item.pid === id) {
//       // 我添加进去的这个 item 可能还有 children，所以在添加之前
//       // 要 从 list 中找谁的 pid 等于 item.id 的，把这些作为 children 的每一项，children 应该挂到  item 上面
//       const children = fn1(list, item.id)
//       if (children.length) {
//         item.children = children
//       }
//       arr.push(item)
//     }
//   })
//   return arr
// }
// console.log(fn1(list))

// const row = { a: 1 }
// function f({ a }) {
//   a = 8
// }
// f(row)

// console.log(row.a)

const a = { sex: 'man' }
// 把第一个参数后面的所有参数，都合（浅拷贝）到第一个参数，返回值就是合并之后的结果
const r = Object.assign({ name: '吕布' }, a, { age: 18, address: '河南' })
console.log(r)
